<template>
	<view>
		<view class="section-title">编辑简历</view>
		<view class="form-group">
			<view class="form-item">
				<view style="display:flex">
					<text class="required">*</text>
					<text>姓名 </text>
				</view>
				<input v-model="form.name" placeholder="请输入姓名" />
			</view>
			<view class="form-item">
				<view style="display:flex">
					<text class="required">*</text>
					<text>年龄 </text>
				</view>
				<input v-model="form.age" type="number" placeholder="请输入年龄（16-80）" />
			</view>
			<view class="form-item">
				<text>工作经验</text>
				<input v-model="form.workExperience" placeholder="如：不限/3年/5年" />
			</view>
			<view class="form-item">
				<text>最高学历</text>
				<picker :range="eduOptions" @change="onEduChange">
					<view class="picker-value">{{ form.degree || '请选择学历' }}</view>
				</picker>
			</view>
			<view class="form-item">
				<text>自我评价</text>
				<input v-model="form.selfEvaluation" placeholder="请输入自我评价" />
			</view>
			<view class="form-item">
				<view style="display:flex">
					<text class="required">*</text>
					<text>求职岗位 </text>
				</view>
				<input v-model="form.job" placeholder="请输入求职岗位" />
			</view>
			<view class="form-item">
				<text>期望薪资</text>
				<input v-model="form.expectedSalary" placeholder="如：3000-5000元" />
			</view>
			<view class="form-item">
				<text>求职区域</text>
				<input v-model="form.area" placeholder="如：长沙范围" />
			</view>
			<view class="form-item">
				<text>自我介绍</text>
				<textarea v-model="form.description" placeholder="请输入自我介绍" />
			</view>
		</view>
		<button class="save-btn" @click="save">保存</button>
	</view>
</template>
<script>
	import { saveResume,personalResume } from '../../utils/api/modules/user';
	
	export default {
		data() {
			return {
				form: {
					name: '',
					age: '',
					gender: '',
					workExperience: '',
					degree: '高中',
					selfEvaluation: '',
					phone: '',
					job: '',
					expectedSalary: '',
					area: '',
					description: '',
					userId: ''
				},
				genderOptions: ['男', '女'],
				eduOptions: ['高中', '大专', '本科', '硕士', '博士']
			}
		},
		onLoad(options) {
			personalResume({
				userId:options.id,
				}).then(res=>{
					this.form = res
					})
				
		},
		methods: {
			onGenderChange(e) {
				this.form.genderIndex = e.detail.value;
				this.form.gender = this.genderOptions[e.detail.value];
			},
			onEduChange(e) {
				  // 方法1：直接更新（需确保 form 是响应式的）
				  this.form.degree = this.eduOptions[e.detail.value];
				},
			save() {
				// 校验
				if (!this.form.name) {
					uni.showToast({
						title: '姓名不能为空',
						icon: 'none'
					});
					return;
				}
				const age = Number(this.form.age);
				if (!age || age < 16 || age > 80) {
					uni.showToast({
						title: '年龄需为16-80之间',
						icon: 'none'
					});
					return;
				}
				if (!this.form.job) {
					uni.showToast({
						title: '求职岗位不能为空',
						icon: 'none'
					});
					return;
				}
				
				// 构建保存的数据
				const saveData = {
					name: this.form.name,
					age: this.form.age,
					gender: this.form.gender,
					workExperience: this.form.workExperience,
					degree: this.form.degree,
					selfEvaluation: this.form.selfEvaluation,
					phone: this.form.phone,
					job: this.form.job,
					expectedSalary: this.form.expectedSalary,
					area: this.form.area,
					description: this.form.description,
					userId: uni.getStorageSync('user').id
				};
				
				// 调用保存接口
				saveResume(saveData)
					.then(res => {
						if (res) {
							uni.showToast({
								title: '保存成功',
								icon: 'success'
							});
							setTimeout(() => {
								uni.redirectTo({
									url: `/pages/mine/personal?id=${saveData.userId}`
								});
							}, 800);
						} else {
							uni.showToast({
								title: '保存失败',
								icon: 'none'
							});
						}
					})
					.catch(err => {
						console.error(err);
						uni.showToast({
							title: '保存失败',
							icon: 'none'
						});
					});
			}
		}
	}
</script>
<style>
	.section-title {
		margin: 32rpx 20rpx 12rpx 20rpx;
		font-size: 30rpx;
		font-weight: bold;
		color: #333;
	}

	.form-group {
		padding: 0 20rpx;
	}

	.form-item {
		margin-bottom: 24rpx;
		background: #fff;
		border-radius: 12rpx;
		box-shadow: 0 2rpx 8rpx #f0f1f2;
		padding: 20rpx 16rpx 10rpx 16rpx;
		display: flex;
		align-items: center
	}

	.form-item text {
		display: flex;
		justify-items: space-between;
		font-size: 26rpx;
		margin-bottom: 8rpx;
	}

	.required {
		color: #fa5151;
		font-size: 22rpx;
	}

	input,
	textarea {
		width: 70%;
		border: 1px solid #eee;
		border-radius: 8rpx;
		padding: 10rpx;
		font-size: 26rpx;
		margin-left: 30px;
		background: #f7f7f7;
	}

	.picker-value {
		padding: 10rpx;
		border: 1px solid #eee;
		border-radius: 8rpx;
		font-size: 26rpx;
		background: #f7f7f7;
	}

	.save-btn {
		background: linear-gradient(90deg, #2ecc71, #54bcbd);
		color: #fff;
		border: none;
		border-radius: 8rpx;
		padding: 16rpx 0;
		font-size: 28rpx;
		margin: 40rpx 20rpx 0 20rpx;
		box-shadow: 0 2rpx 8rpx #b2f0c7;
	}

	picker {
		margin-left: 30px;
	}
</style>